<template>
	<div>
		<div class="title">周末去哪玩</div>
		<ul>
			<li class="items" v-for="item of weekendList" :key="item.id">
				<div class="warper">
					<img class="items-img" :src='item.imgUrl' alt=""/>
				</div>
				<div class="items-ifo">
					<p class="items-pro">{{item.title}}</p>
					<p class="items-desc border-top">{{item.desc}}</p>
				</div>
			</li>
		</ul>
	</div>
</template>

<script>
export default {
  name: 'HomeWeeken',
  // data() {
  // 	return {
  // 		RecommendList: [{
  // 			id: '0001',
  // 		  imgUrl: '//img1.qunarzz.com/vc/a4/29/dd/4a0734b77f675da2a8ca4a9879.jpg',
  // 		  pro: '乐享张家界',
  // 		  desc: '张家界是一很好的界是好的地方'
  // 		  },{
  // 			id: '0002',
  // 		  imgUrl: '//img1.qunarzz.com/vc/a4/29/dd/4a0734b77f675da2a8ca4a9879.jpg',
  // 		  pro: '乐享张家界',
  // 		  desc: '张家界是好的地好的地好的地好的地好的地好的地方'
  // 		  }]
  // 	}
  // }
  props: {
    weekendList: Array
  }
}

</script>

<style lang="stylus" scoped>
@import '~styles/mixins.styl'
	.title
		font-size: 0.42rem
		background: #eee
		line-height: .68rem
	.items
		overflow:hidden
		font-size: .32rem
		mini-width: 0
		.warper
			height: 0
			padding-bottom: 37.9%
			.items-img
				width:100%
				padding: 0
		.items-ifo
			min-width:0
			background:#ffe
			.items-pro
				padding:.1rem
				display:flex
				font-size: .40rem
				Ellipsis()
			.items-desc
				line-height: .55rem
				font-size: .33rem
				color: #aaa
				Ellipsis()
			.border-top
				&:before
					border: .005rem solid #00ff34
					opacity: .2
</style>
